<template>
	<view class="scanDelivery-detailContainer">
		<view class="scanSearch">
			<input class="uni-check-input" type="number" @confirm="check()" v-model="fieldValue" :focus="focus"
				:placeholder="$t('homepage.AccessoryManagement.scanInstorageNo')" />
			<!-- <image src="../../../../../static/assets/public/clean.png" class="icon_clean" @click="onClean()"></image> -->
		</view>
	<!-- 	<v-table :columns="headers" :list="contents" style="margin-bottom: 50px;">
		</v-table> -->
		<button class="submitBtn" type="primary" @click="submit" :disabled="disabled">{{$t('homepage.AccessoryManagement.outStorage')}}</button>
		<!-- <uni-popup ref="popup" type="dialog">
			<view class="uni-popup-dialog">
				<text class="uni-dialog-title">出库数量确认</text>
				<view class="uni-dialog-content">
					<input type="text" class="content-search-input" v-model="num" placeholder="请确认出库数量" />
				</view>
				<view class="uni-dialog-button">
					<text class="uni-dialog-cancelButton-text uni-cancelButton-color" @click="cancel">取消</text>
					<text class="uni-dialog-button-text uni-button-color" @click="sure">确定</text>
				</view>
			</view>
		</uni-popup> -->
		<!-- <uni-popup ref="pop" type="dialog">
			<view class="uni-popup-dialog">
				<text class="uni-dialog-title">配件出库确认</text>
				<view class="uni-dialog-content">
					是否确认全部一键出库？
				</view>
				<view class="uni-dialog-button">
					<text class="uni-dialog-cancelButton-text uni-cancelButton-color" @click="allCancel">取消</text>
					<text class="uni-dialog-button-text uni-button-color" @click="allSure">确定</text>
				</view>
			</view>
		</uni-popup> -->
	</view>
</template>

<script>
	// import vTable from "@/components/no-bad-table/table.vue"
	import {
		getMapyByField,
		applyDetailQueryListMap,
		saveWarehouseOut
	} from "@/api/homepage.js"
	export default {
		components: {
			// vTable
		},
		data() {
			return {
				fieldValue: '',
				focus: false,
				disabled: true,
				headers: [{
						title: '名称',
						key: 'name',
					},
					{
						title: '编码',
						key: 'code'
					},
					{
						title: '型号',
						key: 'spec'
					},
					{
						title: '数量',
						key: 'num'
					},
					{
						title: '出库数量',
						key: 'deliveryNum'
					}
				],
				mapyByField: [],
				foreignIdContent: [],
				scanForeignId: '',
				surplusNum: '',
				warehouseInId: '',
				immediateWarehouseId: '',
				warehousePositionId: '',
				warehouseStorageId: '',
				contents: [],
				detailList: [],
				changeChecked: '',
				changeCheckedLength: '',
				num: '',
				numListData: [],
				selectedList: [],
			}
		},
		onLoad() {
			this.GetApplyDetailQueryListMap()
		},
		mounted() {
			this.focus = true
		},
		methods: {
			GetApplyDetailQueryListMap() {
				this.id = uni.getStorageSync('scanDeliveryId')
				applyDetailQueryListMap({
					warehouseOutId: this.id,
				}).then((res) => {
					if (res.code == 0) {
						this.detailList = res.data
						for (var i = 0; i <= res.data.length; i++) {
							let obj = {}
							obj.id = String(i + 1),
								obj.name = res.data[i].name,
								obj.code = res.data[i].code,
								obj.spec = res.data[i].spec,
								obj.num = res.data[i].num,
								obj.foreignId = res.data[i].foreignId
							this.contents.push(obj)
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 3000,
						})
					}
				})
			},
			contains: function(a, obj) {
				var i = a.length;
				while (i--) {
					if (a[i] === obj) {
						return true;
					}
				}
				return false;
			},
			check() {
				let that = this
				setTimeout(function() {
					that.checkList()
				}, 200)
			},
			checkList: function() {
				uni.hideKeyboard();
				getMapyByField({
					fieldValue: this.fieldValue,
					fieldName: 'billNo'
				}).then((res) => {
					if (res.code == 0) {
						this.fieldValue = ''
						this.scanForeignId = res.data.foreignId
						let foreignIds = []
						this.contents.forEach(function(item) {
							foreignIds.push(item.foreignId)
						})
						if (this.contains(foreignIds, this.scanForeignId)) {
							this.disabled = false
							for (var j = 0; j < this.contents.length; j++) {
								if (this.scanForeignId == this.contents[j].foreignId) {
									if (this.contents[j].num <= res.data.surplusNum) {
										this.num = this.contents[j].num
									} else {
										this.num = res.data.surplusNum
									}
									this.selectedList = this.contents[j]
									this.$refs.popup.open()
								}
							}
						} else {
							uni.showToast({
								title: "未发现对应物料，请重新输入入库id!",
								icon: "none",
								duration: 3000
							})
						}
						this.mapyByField = res.data
						this.warehouseInId = res.data.id
						this.surplusNum = res.data.surplusNum
						this.immediateWarehouseId = res.data.immediateWarehouseId
						this.warehousePositionId = res.data.warehousePositionId
						this.warehouseStorageId = res.data.warehouseStorageId
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 3000
						})
					}
				}).catch((res) => {
					this.fieldValue = ''
					uni.showToast({
						title: res.message,
						icon: 'none',
						duration: 3000
					})
				});
			},
			onClean() {
				this.fieldValue = ''
			},
			submit() {
				this.$refs.pop.open()
			},
			cancel() {
				this.$refs.popup.close()
			},
			sure() {
				this.focus = false
				this.deliveryNum = this.num
				this.$set(this.selectedList, "deliveryNum", Number(this.deliveryNum))
				for (var i = 0; i < this.contents.length; i++) {
					if (this.selectedList.foreignId == this.contents[i].foreignId) {
						this.$set(this.contents[i], "deliveryNum", Number(this.deliveryNum))
						this.$set(this.contents[i], "warehouseInId", this.warehouseInId)
						this.$set(this.contents[i], "surplusNum", this.surplusNum)
						this.$set(this.contents[i], "immediateWarehouseId", this.immediateWarehouseId)
						this.$set(this.contents[i], "warehousePositionId", this.warehousePositionId)
						this.$set(this.contents[i], "warehouseStorageId", this.warehouseStorageId)
						this.$refs.popup.close()
						setTimeout(() => {
							this.focus = true
						}, 100);
					}
				}
			},
			allCancel() {
				this.$refs.pop.close()
			},
			allSure() {
				this.getSaveWarehouseOut()
			},
			getSaveWarehouseOut() {
				this.id = uni.getStorageSync('scanDeliveryId')
				const detailDatas = [];
				for (var j = 0; j < this.contents.length; j++) {
					if (this.contents[j].deliveryNum != undefined) {
						const temp = {
							foreignId: this.contents[j].foreignId,
							warehouseOutId: this.id,
							warehousePositionId: this.contents[j].warehousePositionId,
							warehouseStorageId: this.contents[j].warehouseStorageId,
							warehouseInId: this.contents[j].warehouseInId,
							immediateWarehouseId: this.contents[j].immediateWarehouseId,
							num: this.contents[j].deliveryNum,
						}
						detailDatas.push(temp);
					}
				};
				saveWarehouseOut({
					id: this.id,
					dataArray: JSON.stringify(detailDatas),
				}).then((res) => {
					uni.showToast({
						title: res.message,
						icon: 'none',
						duration: 3000
					})
					if (res.code == 0) {
						uni.navigateBack({
							url: "/pages/HomePage/StoreManagement/AccessoryManagement/ScanDelivery/index"
						})
					} else {
						this.$refs.pop.close()
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: 'none',
						duration: 3000
					})
					this.$refs.pop.close()
				});
			},
		}
	}
</script>

<style lang="scss">
	.scanDelivery-detailContainer {
		page {
			background-color: #F6F7FB;
		}

		.scanSearch {
			display: flex;
			padding: 10px;
			background-color: #F6F7FB;
			margin-top: 5px;
		}

		.uni-check-input {
			border-radius: 4px;
			height: 40px;
			width: 85%;
			background-color: #FFFFFF;
			padding-left: 10px;
		}

		.icon_clean {
			width: 30px;
			height: 30px;
			margin-top: 5px;
			margin-left: 7px;
		}

		.submitBtn {
			bottom: 0;
			position: fixed;
			border-radius: 0;
			width: 100%;
			z-index: 999999;
		}

		.uni-popup-dialog {
			width: 260px;
			border-radius: 15px;
			background-color: #FFFFFF;
		}

		.uni-dialog-title {
			/* #ifndef APP-NVUE */
			display: flex;
			/* #endif */
			flex-direction: row;
			justify-content: center;
			padding-top: 15px;
			padding-bottom: 5px;
		}

		.uni-dialog-content {
			flex-direction: row;
			justify-content: center;
			align-items: center;
			padding: 5px 15px 15px 25px;
		}

		.uni-dialog-button {
			display: flex;
			flex: 1;
			flex-direction: row;
			align-items: center;
			height: 40px;
			flex-direction: row;
			border-top-color: #f5f5f5;
			border-top-style: solid;
			border-top-width: 1px;
		}

		.uni-dialog-cancelButton-text {
			font-size: 14px;
			width: 50%;
			text-align: center;
			border-right: 1px solid #f5f5f5;
		}

		.uni-cancelButton-color {
			color: red;
		}

		.uni-dialog-button-text {
			font-size: 14px;
			width: 50%;
			text-align: center;
		}

		.uni-button-color {
			color: $uni-color-primary;
		}
	}
</style>
